<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>鼠标进入和离开，自己产生效果</title>
		<style type="text/css">
			div{
				width: 100px;
				height: 100px;
				background: palegreen;
			}
		</style>
		<script>
			//进入自己，出现border
			function border2(){
				document.getElementById('box').style.borderTop='2px dashed blue';
			}
			//离开，变回
			function recover(){
				document.getElementById('box').style.border='none';
			}
		</script>
	</head>
	<body>
		<div id="box" onmouseover="border2()" onmouseout="recover()"></div>
	</body>
</html>
